<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <link rel="stylesheet" href="style/css/main.css">
        <link rel="stylesheet" href="style/css/common.css">
        <link rel="stylesheet" href="style/css/home.css">
        <link rel="stylesheet" href="style/css/set.css">
        <link rel="stylesheet" href="style/font/css/font-awesome.min.css">
    </head>
    <body>
    	<!--头部导航开始-->
    	<div class="w100pre top">
    		<div class="w960">
    			<div class="pull_left top_nav">
    				<a href="#">中关村在线</a> | 
    				<a href="#">产品报价</a> | 
    				<a href="#">ZOL商城</a> | 
    				<a href="#">Z团</a> | 
    				<a href="#">论坛</a> | 
    				<a href="#">经销商</a>
    			</div>
    			<ul class="pull_right top_login">
    				<li>欢迎来到ZOL商城，请<a href="#">登录</a> [<a href="#">免费注册</a>]</li>
    				<li><a href="#" class="cart">购物车(<span>1</span>)</a></li>
					<li><a href="#">帮助中心</a></li>
					<li>客服电话：<span>400-678-0068</span></li>
    			</ul>
    		</div>
    	</div>
    	<!--头部导航结束-->
		
		<!--banner区域开始-->
		<div class="w960 banner">
			<div class="logo"><a href="#"><img src="images/logo_180x50.png"/></a></div>
			<div class="title">中关村在线旗下网上商城</div>
			<div class="search">
				<div class="text">
					<input type="text">
					<button>搜 索</button>
				</div>
				<div class="word">
					<a href="">月末亏本促</a> 
					<a href="">华为荣耀4C</a>
					<a href="">华为</a>
					<a href="">荣耀7</a>
					<a href="">魅族</a>
					<a href="">MX5</a>
					<a href="">魅蓝</a>
					<a href="">Note2</a>
				</div>
			</div>
		</div>
		<!--banner区域结束-->
		
		<!--整站通用导航菜单 开始-->
		<div class="w100pre navbar">
			<ul class="w960">
				<li class="nav"><a href="">全部商品分类</a><i class="fa fa-chevron-down"></i></li>
				<li><a href="">首页</a></li>
				<li><a href="">团购</a></li>
				<li><a href="">限时抢购</a></li>
				<li><a href="">秒杀</a></li>
				<li><a href="">众筹</a></li>
			</ul>
		</div>
		<!--整站通用导航菜单 结束-->

		<!--当前位置 开始-->
		<div class="w960 location">
			<i class="fa fa-home"></i> <a href="">zol商城</a> > <a href="">手机</a> > 小米MI 红米NOTE2
		</div>
		<!--当前位置 结束-->

		<!--个人中心 开始-->
		<div class="w960 center">
			<div class="sidebar">
				<dl>
					<dt><i class="fa fa-user"></i> 个人中心</dt>
					<dd><a href=""><i class="fa fa-cog"></i> 个人资料</a></dd>
					<dd><a href=""><i class="fa fa-lock"></i> 密码修改</a></dd>
					<dd><a href=""><i class="fa fa-paper-plane"></i> 收货地址</a></dd>
				</dl>
				<dl>
					<dt><i class="fa fa-table"></i> 订单相关</dt>
					<dd><a href=""><i class="fa fa-file-text"></i> 订单列表</a></dd>
					<dd><a href=""><i class="fa fa-star"></i> 我的收藏</a></dd>
				</dl>
			</div>
			<div class="content">
				<div class="info">
					<div class="user">
						<div class="avatar"><img src="style/img/avatar.jpg"></div>
						<div class="intro">
							<h2>晚上好，方先生</h2>
							<p>欢迎登录zol商城，与其在别处仰望，不如在这里并肩</p>
							<ul>
								<li>真实姓名：<span>方怡</span></li>
								<li>手机号码：<span>13666456389</span></li>
								<li>邮箱地址：<span>2563883@qq.com</span></li>
							</ul>
						</div>
					</div>
				</div>
				<div class="fast_nav">
					<ul>
						<li><a href=""><i class="fa fa-road"></i> 登录日志</a></li>
						<li class="active"><a href=""><i class="fa fa-cog"></i> 个人资料</a></li>
						<li><a href=""><i class="fa fa-lock"></i> 修改密码</a></li>
						<li><a href=""><i class="fa fa-paper-plane"></i> 收货地址</a></li>
					</ul>
				</div>
				<div class="list">
					<div class="set">
						<dl>
							<dt>昵称：</dt>
							<dd><input type="text"> 昵称（2-10字）</dd>
						</dl>
						<dl>
							<dt>性别：</dt>
							<dd><input type="radio"> 男 <input type="radio"> 女</dd>
						</dl>
						<dl>
							<dt>出生年月：</dt>
							<dd>
								<select>
									<option value="">1989</option>
									<option value="">1990</option>
									<option value="">1991</option>
								</select>
								年
								<select>
									<option value="">1989</option>
									<option value="">1990</option>
									<option value="">1991</option>
								</select>
								月
								<select>
									<option value="">1989</option>
									<option value="">1990</option>
									<option value="">1991</option>
								</select>
								日
							</dd>
						</dl>
						<dl>
							<dt>注册时间：</dt>
							<dd><input type="text"> </dd>
						</dl>
						<dl>
							<dt>头像：</dt>
							<dd><img src="style/img/avatar.jpg"> <button>上传</button></dd>
						</dl>
						<dl>
							<dt></dt>
							<dd><input type="submit" value="修改资料"></dd>
						</dl>
					</div>
				</div>
			</div>
		</div>
		<!--个人中心 开始-->

		<!--footer 开始-->
		<div class="w100pre footer">
			<!--bottom 开始-->
			<div class="w100pre bottom">
				<div class="w960 copyright">
					<a href="#">关于ZOL商城</a>
					<a href="#">帮助中心</a>
					<a href="#">联系我们</a>
					<a href="#">发展历程</a>
					媒体报道©2015 中关村在线 版权所有. 京ICP备09041801号-182 京ICP证010391号 
					<div class="authentication">
						<a href="#"><img src="style/img/beian.jpg"></a>
						<a href="#"><img src="style/img/jingcha.jpg"></a>
						<a href="#"><img src="style/img/chengxin.jpg"></a>
					</div>
				</div>
			</div>
			<!--bottom 结束-->
		</div>
		<!--footer 结束-->

    </body>
</html>